<template>
  <el-tabs v-model="activeName" type="card" style="height: 240px;margin-bottom: 0px">
    <el-tab-pane label="TCP" name="first"><tcpdata v-bind:host="host" v-bind:docker="docker"></tcpdata></el-tab-pane>
    <el-tab-pane label="UDP" name="second"><udpdata v-bind:host="host" v-bind:docker="docker"></udpdata></el-tab-pane>
    <el-tab-pane label="ICMP" name="third"><icmpdata v-bind:host="host" v-bind:docker="docker"></icmpdata></el-tab-pane>
  </el-tabs>
</template>
<script>
import Tcpdata from "@/components/tcpdata";
import Udpdata from "@/components/udpdata";
import Icmpdata from "@/components/icmpdata";
export default {
  name: 'chooseprotocol',
  components: {Icmpdata, Udpdata, Tcpdata},
  data() {
    return {
      activeName: 'first',
    };
  },
  mounted() {
      // setTimeout(console.log(this.host), 1000);
  },
  props: [
      "host",
      "docker"
  ]
};
</script>
<style scoped>
</style>